<template>
	<view>
		<view class="flex flex-direction justify-center align-center margin-top" style="gap: 38px;">
			<view class="item bg1" @tap="$openrul('/subpackage/randomAnswer/randomAnswer')">
				<view class="padding flex flex-direction">
					<view class="text-xxl text-bold text-white">竞速答题</view>
					<view class="padding-top-xs text-sm text-white">10道</view>
					<view class="padding-top-xs text-sm text-white">可获得5积分</view>
				</view>
			</view>
			<view class="item bg2" @tap="$openrul('/pages/pkAnswer/pkAnswer')">
				<view class="padding flex flex-direction">
					<view class="text-xxl text-bold text-white">PK答题(2人)</view>
					<view class="padding-top-xs text-sm text-white">20道</view>
					<view class="padding-top-xs text-sm text-white">可以获得20分</view>
				</view>
			</view>
			<view class="item bg3">
				<view class="padding flex flex-direction">
					<view class="text-xxl text-bold text-white">教师题库</view>
					<view class="padding-top-xs text-sm text-white">25个题库</view>
				</view>
			</view>
			<view class="item bg4">
				<view class="padding flex flex-direction">
					<view class="text-xxl text-bold text-white">学生题库</view>
					<view class="padding-top-xs text-sm text-white">提交到老师审核</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {

		}
	},
	methods: {

	}
}
</script>

<style>
.item {
	width: 340px;
	height: 130px;
}

.bg1 {
	background-image: url('');
	background-size: cover;
}

.bg2 {
	background-image: url('');
	background-size: cover;
}

.bg3 {
	background-image: url('');
	background-size: cover;
}

.bg4 {
	background-image: url('');
	background-size: cover;
}
</style>
